.bg-chngess {
  background-color: rgba(0, 0, 0, 0.33);
  backdrop-filter: blur(5px);
  border-radius: 6px;
}

.breadcrumb-area::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 0;
}

.breadcrumb-area {
  position: relative;
  background-size: cover;
  background-position: center;
  color: #fff;
  text-align: center;
  padding-top: 200px;
}

.choose-area {
  position: relative;
  color: #fff;
  z-index: 2;
}

.choose-area * {
  color: #fff !important;
  position: relative;
  z-index: 2;
}

.choose-area::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  /* Dark overlay */
  z-index: 1;
}

.choose-area,
.choose-area h1,
.choose-area h2,
.choose-area h3,
.choose-area h4,
.choose-area h5,
.choose-area h6,
.choose-area p,
.choose-area span,
.choose-area a {
  color: #fff !important;
}

.icon-wrap {
  background-color: #ff4c29;
  width: 60px;
  height: 60px;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  color: #000;
  flex-shrink: 0;
}

.icon-wrap img {
  max-width: 44px;

}

.choose-box {
  gap: 15px;
  align-items: flex-start;
}

.product-card {
  width: 100%;
  height: auto;
  background-color: #ffffff;
  /* Your dark blue */
  border-radius: 0rem;
  padding: 2rem;
  color: #0B163C;
  /* Make all text white by default */
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-sizing: border-box;
  overflow: hidden;
  transition: transform 0.4s ease, box-shadow 0.4s ease;

}

.product-card:hover {
  transform: translateY(-10px) scale(1.02);
  box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.4);
}

.product-card__thumb {
  position: relative;
  overflow: hidden;
}

.product-card__img {
  width: 100%;
  height: 198px;
  margin: 0 auto;
  filter: drop-shadow(5px 10px 15px rgba(8, 9, 13, 0.4));
  transition: transform 0.5s ease;
}

.product-card:hover .product-card__img {
  transform: scale(1.05) rotate(-2deg);
}

.product-card__badge {
  position: absolute;
  bottom: 10px;
  left: 10px;
  background: #00a79d;
  padding: 0.3rem 0.8rem;
  border-radius: 4px;
}

.badge-text {
  color: #0B163C;
  font-weight: bold;
  font-size: 14px;
}

.product-card__data {
  text-align: left;
  transition: transform 0.5s;
  color: #0B163C;
  /* Ensure data text is white */
}

.product-card__title {
  padding-top: 15px;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: .5rem;
  color: #0B163C;
  transition: 0.5s;
}

.product-card__description {
  font-size: 0.95rem;
  color: #0B163C;
  margin-bottom: 1rem;
  transition: 0.5s;
}

.product-card__progress {
  text-align: left;
  margin-top: 1rem;
}

.progress-count {
  font-weight: bold;
  color: #0B163C;
}

.progress-bar-container {
  width: 100%;
  height: 8px;
  background-color: #2c3e50;
  border-radius: 4px;
  overflow: hidden;
  margin: 0.5rem 0;
}

.progress-bar-fill {
  height: 100%;
  background-color: #00a79d;
  width: 0;
  transition: width 1s ease-in-out;
}

.progress-goals {
  display: flex;
  justify-content: space-between;
  color: #fff;
  font-size: 0.9rem;
}

.product-card__button {
  display: inline-block;
  padding: 10px 20px;
  background-color: #00a79d;
  color: #fff;
  border-radius: 5px;
  text-decoration: none;
  font-weight: bold;
  margin-top: 1rem;
  transition: 0.3s;
}

.product-card:hover .product-card__button {
  box-shadow: 0 8px 20px rgba(0, 167, 157, 0.6);
  transform: translateY(-2px);
}

.product-card__button:hover {
  background-color: #00877e;
}

.product-slider .slick-track {
  display: flex;
  gap: 20px;
  /* 20px gap between slides */
}

.product-slider .slick-slide {
  padding: 24px !important;
  /* no internal padding - gap from track only */
}


.custom-arrow {
  position: absolute;
  bottom: -58px;
  top: auto;
  left: auto;
  right: auto;
  transform: translateX(-50%);
  background: #0B163C;
  color: white;
  border: none;
  padding: 16px 15px;
  font-size: 28px;
  cursor: pointer;
  z-index: 99;
  opacity: 1 !important;
  visibility: visible !important;
}

.custom-arrow:hover {
  background: #0B163C;
}

/* Center left and right arrows next to each other */
.slick-prev {
  left: 48%;
}

.slick-next {
  left: 52%;
}

.slick-prev span {
  position: absolute;
  right: 11px;
}

.slick-next span {
  position: absolute;
  left: 11px;
}

/* Prevent arrows from hiding when disabled by Slick */
.slick-disabled {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.slick-prev::before,
.slick-next::before {
  display: none;
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  color: white !important;
  background-color: #0B163C;
}

.job-card {
  border: 1px solid #e0e0e0;
  transition: all 0.3s ease-in-out;
}

.job-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

.job-card__link {
  color: #000;
  font-weight: 500;
  transition: color 0.2s ease-in-out;
}

.job-card__link:hover {
  color: #0a58ca;
  text-decoration: underline;
}

.badge {
  background-color: rgb(11, 22, 60);
}

.form-control:focus {
  border-color: #ffff !important;
  box-shadow: 1px 1px 4px 1px rgb(11, 22, 60) !important;
}

.chng-e-from .form-control {
  padding: 16px 16px;
}

.bg-table {
  background-color: #0B163C !important;
}

.table>:not(:last-child)>:last-child>* {
  color: white !important;
}

.page-item.active .page-link {
  color: #ffff;
  background-color: rgb(11, 22, 60);
  border: none;
}

.jobSlider .slick-slide {
  margin-bottom: 20px;
  /* vertical gap */
}

.jobSliderWrapper {
  height: 400px !important;
  /* visible area */
  overflow-y: auto !important;
  position: relative;
}

.jobSliderContent {
  display: flex;
  flex-direction: column;
  animation: scrollUp 10s linear infinite;
}

.jobSliderWrapper:hover .jobSliderContent {
  animation-play-state: paused;
}

.jobItem {
  padding: 10px;
  background: #f5f5f5;
  margin-bottom: 10px;
  border-radius: 4px;
}

@keyframes scrollUp {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(-50%);
  }
}

.jobSlider a {
  display: inline-flex;
  align-items: center;
  /* vertical center align karega */
  gap: 5px;
  /* icon, text, gif ke beech gap */

  font-size: 18px;
}

.jobSlider a img {
  height: 16px;
  width: auto;
}

.bd-latest {
  background-color: #0B163C;
  padding: 16px;
  color: white;
}

.one-sl img {
  width: 278px;
  /* Fixed width */
  height: 112px;
  /* Fixed height */
  object-fit: contain;
  /* Image ko crop na kare, adjust kare */
  margin: auto;
  display: block;
  background: transparent;
}

.whatsapp-float {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 9999;
  display: inline-block;
  animation: floatGlow 3s ease-in-out infinite;
}

.whatsapp-float img {
  width: 60px;
  height: 60px;

}

/* Keyframe Animation: Up-Down + Glow */
@keyframes floatGlow {

  0%,
  100% {
    transform: translateY(0);

  }

  50% {
    transform: translateY(-8px);

  }
}


.call-float {
  position: fixed;
  left: 20px;
  bottom: 20px;
  z-index: 9999;
  display: inline-block;
  animation: floatGlowCall 3s ease-in-out infinite;
}

.call-float img {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: #0d6efd;
  /* Bootstrap Blue */
  padding: 10px;
}

/* Keyframe Animation: Up-Down + Glow */
@keyframes floatGlowCall {

  0%,
  100% {
    transform: translateY(0);

  }

  50% {
    transform: translateY(-8px);

  }
}



.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
  background-color: #0B163C;
  color: white !important;

}

.nav-pills .nav-link {
  color: rgb(26, 26, 26) !important;
}

a.btn.wa-btn.btn-sm {
  background-color: #25d366;
  color: white;
}

ul#pills-tab {
  background: #c2c2c2;
}

.card-img-top {
  max-height: 224px !important;

}

.table>:not(caption)>*>* {
  padding: .5rem .5rem;
  background-color: var(--bs-table-bg);
  border-bottom-width: 1px;
  box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
  text-transform: capitalize !important;
}